<template>
  <div>
    孙子组件
    <button @click="change">修改颜色</button>

    <div class="box">

    </div>
    <hr>
  </div>
</template>
<script setup lang='ts'>
import type { Ref } from 'vue';
import { inject } from 'vue';
const color = inject<Ref<string>>('color')
const change = () => {
  color!.value = 'blue'
}
</script>
<style scoped lang='less'>
.box {
  height: 100px;
  width: 100px;
  border: 1px solid #ccc;
  background: v-bind(color);
}
</style>